
//多个物料规定
import loadComponent from './index_map';
import { v4 as uuidv4 } from 'uuid'; 
import { cloneDeep } from 'lodash'; // 或自己实现深拷贝
import type { Component  } from 'vue';

const component_map:component_config={
    'Linelayout':{
        id:uuidv4(),
        type:'Linelayout',
        componentName:'div',
        currentComponent:null as unknown as Component,
        title:'线性布局',
        group:'Layout',
        props:{
            'text':{
                name:'',
                propType:'',
                default:'',
                title:'',
                text:'',
                required:true,
            }
        },
        children:[],
        slots:{},
        events:{}
    },
    'Button':{
        id:uuidv4(),
        type:'Button',
        componentName:'el-button',
        currentComponent:null as unknown as Component,
        title:'按钮',
        group:'Display',
        props:{
            'text':{
                name:'text',
                propType:'string',
                default:'按钮',
                title:'按钮的文本',
                text:'文本内容',
                required:true,
            },
            'type':{
                name:'type',
                propType:'string',
                default:'primary',
                title:'按钮类型',
                text:'primary',
                required:true,
            }
        },
        children:[],
        slots:{},
        events:{}
    },
    'Gridlayout':{
        id:uuidv4(),
        type:'Gridlayout',
        componentName:'el-row',
        currentComponent:null as unknown as Component,
        title:'栅格布局',
        group:'Layout',
        props:{
            'text':{
                name:'',
                propType:'',
                default:'',
                title:'',
                text:'',
                required:true,
            }
        },
        columns:[
            { id: `col-0-${Date.now()}`, children: [] },
            { id: `col-1-${Date.now()}`, children: [] },
            { id: `col-2-${Date.now()}`, children: [] },
            { id: `col-3-${Date.now()}`, children: [] },
        ],
        children:[],
        slots:{},
        events:{}
    }
}

//获取对应的组件的协议——DSL
function getDSL(name:string){
    // console.log('component-name',name)
    const original=component_map[name];
    original.currentComponent=loadComponent(name);//获取组件路径
    const new_original=cloneDeep(original); //深拷贝，防止调用此方法时获取的original都是同一块引用地址，从而导致渲染树数据渲染错误
    if(!original){
        console.log('无法找到对应的组件，没有对应的DSL');
    }else{
        return new_original;
    }
}
export default getDSL;